<template>
    <div>
        <this-dialog :is-show="isShowCheckDialog" @on-close="checkStatus"><!--两次事件监听 -->
            请检查你的支付状态！
            <div class="button" @click="checkStatus">支付成功</div>
            <div class="button" @click="checkStatus">支付失败</div>
        </this-dialog>
        <this-dialog :is-show="isShowSuccessDialog" @on-close="toOrderList">
            购买成功
        </this-dialog>
        <this-dialog :is-show="isShowFailDialog"  @on-close="toOrderList">
            购买失败
        </this-dialog>
    </div>
</template>
<script>
import thisDialog from '../components/dialog'
export default {
    components:{
        thisDialog
    },
    props:{
        isShowCheckDialog:{//通过外部传递过来滴
            type:Boolean,
            default:false
        },
        orderId:{
            type:[String,Number]
        }
    },
    data(){
        return{
            isShowSuccessDialog: false,
            isShowFailDialog: false
        }
    },
    methods:{
        checkStatus(){
            //检查支付状态
            console.log('订单的orderId ' + this.orderId);
            this.$http.post('/api/checkOrder',{orderId:this.orderId})
            .then((res) =>{
                this.isShowSuccessDialog = true;
                this.$emit('on-close-check-dialog')//传递到上一个层
            },(err)=>{
                console.log(err);
                this.isShowFailDialog = true;
                this.$emit('on-close-check-dialog')
            })
        },
        toOrderList(){
            this.$router.push({path:'../orderList'});
        }
    }
}
</script>
<style>

</style>

